.post-list
  display: flex;
  flex-wrap: wrap;
  position: relative;
  justify-content: space-between;
  .post-overview
    margin-bottom: 16px;
    border-radius: 3px;
    position: relative;
    card-lignt();
    +pc-layout()
      width: 49.2%;
    +sp-layout()
      width: 100%;
    .post-header
      padding: $card-padding;
      .post-title
        font-size: $font-size-large;
        font-weight: $font-weight-normal;
        line-height: 1.8;
    .post-meta-wrapper
      &::before
        content: '';
        position: absolute;
        top: 0;
        left: -20px;
        right: -20px;
        height: 1px;
        background: $bg-dark-line;
      margin: 0 14px;
      position: relative;
      z-index: $zIndex-2;
      max-width: 100%;
      height: 50px;
      flexCenter();
      +sp-layout()
        padding: 0 6px;
      .post-meta
          position: absolute;
          left: 0;
          top: 0;
          right: 0;
          bottom: 0;
          overflow: auto;
          display: flex;
          word-break: keep-all;
          ::selection
            background: transparent;
            color: black;
          +sp-layout()
            & > span
              margin-right: 6px !important;
          & > span
            display: flex;
            align-items: center;
            margin-right: 12px;
            &: last-child
              margin-right: 0;
            span
              padding-right: 6px;
              &:last-child
                padding-right: 0px;
            .icon-calendar, 
            .icon-fire, 
            .icon-tag,
            .icon-bookmark-empty
              margin-right: 4px;
            .icon-calendar
            .icon-fire
              margin-top: -2px;
    .post-link
      fillParent(absolute, $zIndex-1)